<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
  xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout"
layout:decorator="layout">
  <head>
  	<title>比赛列表</title>
    <script type="text/javascript">
    	var id = getQueryString("id");
    	var type = 'BM'
    	var findDate = function(beginAt, endAt,flg){
    		var head = [];
    		if(type == 'BM'){
    			head = [{name:'报名人数（提交）', show:true, open:true},
    			        {name:'报名过审人数', show:true, open:false},
    			        {name:'报名成功人数', show:true, open:false},
    			        {name:'报名收费', show:false, open:false},
    			        {name:'已拒绝', show:false, open:false},
    			        {name:'待审核', show:false, open:false}];
    		} else if(type == 'ZP'){
    			head = [{name:'作品帖数（所有）', show:true, open:true},
    			        {name:'作品帖数（最终）', show:true, open:false},
    			        {name:'评委点评作品数', show:true, open:false},
    			        {name:'评委打分作品数', show:true, open:false}];
    		} else if(type == 'SF'){
    			head = [{name:'报名收费', show:true, open:true},
    			        {name:'报名成功人数', show:false, open:false},
    			        {name:'商品售卖数', show:false, open:false},
    			        {name:'商品收费', show:true, open:false}];
    		} else if(type == 'LL'){
    			head = [{name:'帖子浏览数', show:true, open:true}];
    		} else if(type == 'DK'){
    			head = [{name:'帖子打开数', show:true, open:true}];
    		} else if(type == 'HD'){
    			head = [{name:'互动总数', show:true, open:true},
    			        {name:'点赞数量', show:true, open:false},
    			        {name:'打分数量', show:true, open:false},
    			        {name:'点评数量', show:true, open:false},
    			        {name:'讨论数量', show:true, open:false},
    			        {name:'投票数量', show:true, open:false}];
    		}
    		$("#infoTableHead").loadData({list:head});
    		$.ajaxData({url:"list-detail-count-detail", data:{id:id,beginAt:beginAt,endAt:endAt,type:type,flg:flg}, success:function(ret){
    			var x=[];
				var yData = [];
    			$.each(ret, function(i,v){
    				x.unshift(v.date);
    				v.countHtml = '';
    				$.each(head, function(i2,v2){
    					v.countHtml += "<td>"+(v[v2.name] == null ? 0 : v[v2.name]) +"</td>"
    				});
    			});
    			$("#infoDetailCounts").loadData({counts:ret});
    			$.each(head, function(i,v){
    				if(v.show){
	    				var show = (i==0?true:false);
	    				var headData = {name:v.name,show:v.open,data:[]};
	    				$.each(ret, function(i2,v2){
	    					var count = (v2[v.name]==null?0:v2[v.name])
	    					headData.data.unshift(count)
	       				});
	    				yData.push(headData);
    				}
    			})
   				$("#echarts").echartsLine({xData:x, yData:yData});
    		}});
    	};
    	
    	var beforeDate = function(day, obj,flg){
    		if(obj != null){
    			$(".detail-s-bar").removeClass("active");
    			$(obj).addClass("active");
    		}
    		var beginAt = new Date().DateAdd(day).Format("yyyy-MM-dd");
    		var endAt = new Date().Format("yyyy-MM-dd");
    		findDate(beginAt, endAt,flg);
    	};
    	
    	var clickType = function(obj, type, name){
    		this.type = type;
    		$(".detail-c-box").removeClass("active");
    		$(obj).addClass("active");
    		$(".detail-s-bar").removeClass("active");
			$(".detail-s-bar").eq(1).addClass("active");
    		$(".detail-s-title").html(name);
    		beforeDate(-14,null,14);
    	};
    	
    	function editBSZ(){
    		alert('暂不支持主办方自行更改比赛配置，如有需要请联系平台运营。');
    	};
    	
  	 function export_execl(){
    		location.href="exportExecl?id="+id+"&type="+type;
        };
    	
    	function goToMemo(){
    		var $form = $('<form>').attr({id : "form",method : "get",action : 'memo/init'});
    	    $form.appendTo($("#modal"));
    	 	$('<input type="hidden">').attr({name : "id",value : id }).appendTo($form);
    	 	$('<input type="hidden">').attr({name : "flgs",value : "0" }).appendTo($form);
    	 	$form.submit();
    	};
    	
    	$(function(){
    		$.ajaxData({url:"list-detail", data:{id:id}, success:function(ret){
    			setMenu(ret.title)
    			ret.publishAt = new Date(ret.publishAt).Format("yyyy-MM-dd")
    			ret.endAt = new Date(ret.endAt).Format("yyyy-MM-dd")
    			$("#infoDetail").loadData(ret);
    		}});
    		$.ajaxData({url:"list-detail-stage", data:{id:id}, success:function(ret){
    			$.each(ret, function(i,v){
    				v.beginAt = new Date(v.beginAt).Format("yyyy-MM-dd HH:mm");
    				v.endAt = new Date(v.endAt).Format("yyyy-MM-dd HH:mm");
    			});
    			$("#infoStages").loadData({stages:ret});
    		}});
    		$.ajaxData({url:"list-detail-count", data:{id:id}, success:function(ret){
    			$("#infoCounts").loadData(ret);
    		}});
    		$.ajaxData({url:"getMemoList", data:{id:id,flgs:"0"}, success:function(obj){
    			$.each(obj, function(i,v){
        			v.createdAt = new Date(v.createdAt).Format("yyyy-MM-dd");
        			if(v.context.length>40){
        				v.context = v.context.substring(0, 40)+"...";
        			}
        		});
    			$("#memoInfo").loadData({stages:obj});
    		}});

    		var beginAt = new Date().DateAdd(-7).Format("yyyy-MM-dd");
    		var endAt = new Date().Format("yyyy-MM-dd");
			var dateRange =new pickerDateRange('listStageDate', {
	            isTodayValid : true,
	            startDate:beginAt,
	            endDate:endAt,
	            defaultText : ' 至 ',
	            theme : 'ta',
	            success : function(obj) {
	            	$(".detail-s-bar").removeClass("active");
	            	if(obj.endDate == ''){
	            		obj.endDate = obj.startDate;
	            	}
	            	if(obj.endDate == ''){
	            		return;
	            	}
	            	findDate(obj.startDate,obj.endDate,0);
	            }
	        });
			$('.opt_sel').on('click',function(e){setTimeout(function(){ $('#listStageDate').click();}, 0)});
    		clickType(null, "BM", "报名人数");
    	}); 
    </script>
  </head>
  <body>
  
	<div layout:fragment="content" class="content" id="modal">
			<script type="text/template" id="infoDetail">
			<div class="info-box col-38">
			    <div class="info h200">
			    	<div class="info-top">
			    		<div class="info-title">比赛组Id: #{id}#</div>
						<a class="edit-button right3" href="javascript:editBSZ()">编辑</a>
			    	</div>
			    	<div class="info-cont">
			    		<div class="info-img">
			    			<img alt="" src="#{imgUrl}#"/>
			    			<span class="info-img-label">进行中</span>
			    		</div>
			    		<div class="info-detail">
			    			<div class="info-cont-title"><strong>#{title}#</strong></div>
			    			<div class="info-cont-text">
								<div class="info-t">
									<label class="info-t-label">地点：</label>
									<span class="info-t-text">#{area}#</span>
								</div>
								<div class="info-t">
									<label class="info-t-label">时间：</label>
									<span class="info-t-text">#{timeInList}#</span>
								</div>
								<div class="info-t">
									<label class="info-t-label">主办方：</label>
									<span class="info-t-text">#{userOrganizaName}#</span>
								</div>
								<div class="info-t">
									<label class="info-t-label">报名费：</label>
									<span class="info-t-text">#{charge}#</span>
								</div>
							</div>
			    		</div>
			    	</div>

		    	</div>
				
		    </div>
		    </script>
		    
		    <div class="info-box col-38">
			    <div class="info h200">
			    	<div class="info-top">
			    		<div class="info-title">重要事项</div>
			    		<div class="info-btn">
			    			<a href="#">更多</a>
			    		</div>
			    	</div>
			    	<div class="info-tag-cont">
			    		<div class="info-tag-box">
			    			<div class="info-tag">
			    				<label class="info-tag-label">主办方</label>
			    				<div class="info-tag-t">
			    					<span class="info-tag-l"><i class="info-alert info-alert-success"></i></span>
			    					<span class="info-tag-text">1</span>
			    				</div>
			    			</div>
			    		</div>
			    		
			    		<div class="info-tag-box">
			    			<div class="info-tag">
			    				<label class="info-tag-label">客服私信</label>
			    				<div class="info-tag-t">
			    					<span class="info-tag-l"><i class="info-alert info-alert-success"></i></span>
			    					<span class="info-tag-text">1</span>
			    				</div>
			    			</div>
			    		</div>
			    		<div class="info-tag-box">
			    			<div class="info-tag">
			    				<label class="info-tag-label">比赛阶段</label>
			    				<div class="info-tag-t">
			    					<span class="info-tag-l"><i class="info-alert info-alert-success"></i></span>
			    					<span class="info-tag-text">1</span>
			    				</div>
			    			</div>
			    		</div>
			    		<div class="info-tag-box">
			    			<div class="info-tag">
			    				<label class="info-tag-l info-tag-label">评委人数</label>
			    				<div class="info-tag-t">
			    					<span class="info-tag-l"><i class="info-alert info-alert-success"></i></span>
			    					<span class="info-tag-text">1</span>
			    				</div>
			    			</div>
			    		</div>
			    		
			    		<div class="info-tag-box">
			    			<div class="info-tag">
			    				<label class="info-tag-l info-tag-label">财务管理</label>
			    				<div class="info-tag-t">
			    					<span class="info-tag-l"><i class="info-alert info-alert-success"></i></span>
			    					<span class="info-tag-text">1</span>
			    				</div>
			    			</div>
			    		</div>
			    		<div class="info-tag-box">
			    			<div class="info-tag">
			    				<label class="info-tag-l info-tag-label">新闻公告</label>
			    				<div class="info-tag-t">
			    					<span class="info-tag-l"><i class="info-alert info-alert-warning"></i></span>
			    					<span class="info-tag-text">1</span>
			    				</div>
			    			</div>
			    		</div>
			    		
			    	</div>
		    	</div>
		    </div>
		    
		    <div class="info-box col-24">
			    <div class="info h200">
			    	<div class="info-top">
			    		<div class="info-title">日程备忘</div>
			    		<div class="info-btn">
			    			<a href="javascript:goToMemo()">更多</a>
			    		</div>
			    	</div>
			    	<script type="text/template" id="memoInfo">
			    	<div class="info-tag-cont">
			    		#for(memo:stages)#
						<div class="info-f">
			    			<span class="info-f-date">#{memo.createdAt}#</span>
			    			<span class="info-f-text">#{memo.context}#</span>
			    		</div>
						#endfor#
			    	</div>
					</script>
		    	</div>
		    </div>
		    
		    <div class="modal">
		    <div class="detail">
		    <div class="detail-table">
		       	<h4 class="detail-table-title">阶段数据</h4>
			    <div class="table_list">
	               <div class="table-overflow">
	                   <table class="table">
	                       <thead>
	                           <tr>
	                               <th class="">阶段</th>
	                               <th>开始时间</th>
	                               <th>结束时间</th>
								   <th>联合推荐</th>
								   <th>评委</th>
								   <th>新闻</th>
								   <th>商品</th>
								   <th>候选人</th>
								   <th>报名</th>
	                               <th>操作</th>
	                           </tr>
	                       </thead>
	                       <tbody>
	                       <script type="text/template" id="infoStages">
							#for(e:stages)#
	                       	<tr>
                               	<td><strong>#{e.label}#</strong></td>
                               	<td>#{e.beginAt}#</td>
                               	<td>#{e.endAt}#</td>
                              	<td><a href="recommend/init?id=#{e.evaluateId}#"> #{e.eborCount}#</a></td>
								<td><a href="detail/pw/info?id=#{e.evaluateId}#"> #{e.juryCount}#</a></td>
								<td>#{e.newCount}#</td>
								<td>#{e.ecCount}#</td>
								<td>#{e.singupPoolCount}#</td>
								<td>#{e.applyCount}#</td>
                                <td>
                                  <div class="group-btn">
                                    <a class="edit-button right-do" href="detail/info?id=#{e.evaluateId}#">进入比赛</a>
                                  </div>
                                </td>
                           	</tr>
							#endfor#
							</script>
	                     </tbody>
	                 </table>
	             </div>
	          </div>
	          </div>
	          </div>
         	</div>
         	
         	<div class="modal">
         		<div class="detail">
         			<div class="detail-top">
         				<label class="detail-title"><strong>关键数据</strong><i class="icon-help"></i></label>
         			</div>
         			<div class="detail-cont">
         				<script type="text/template" id="infoCounts">
         				<div class="detail-c-box active" onclick="clickType(this, 'BM', '报名人数')">
         					<div class="detail-c">
         						<div class="detail-c-label">报名人数</div>
         						<div class="detail-c-count"><strong>#{applyCount}#</strong></div>
         						<div class="detail-c-day">
									<label class="detail-c-l">今日</label>
									<label class="detail-c-c">#{applyCountDay}#</label>
								</div>
         					</div>
         				</div>
         				<div class="detail-c-box" onclick="clickType(this, 'ZP', '作品帖数')">
         					<div class="detail-c">
         						<div class="detail-c-label">作品帖数</div>
         						<div class="detail-c-count"><strong>#{blogCount}#</strong></div>
         						<div class="detail-c-day">
									<label class="detail-c-l">今日</label>
									<label class="detail-c-c">#{blogCountDay}#</label>
								</div>
         					</div>
         				</div>
         				<div class="detail-c-box" onclick="clickType(this, 'SF', '收费总数')">
         					<div class="detail-c">
         						<div class="detail-c-label">收费总数</div>
         						<div class="detail-c-count"><strong>#{orderCount}#</strong></div>
         						<div class="detail-c-day">
									<label class="detail-c-l">今日</label>
									<label class="detail-c-c">#{orderCountDay}#</label>
								</div>
         					</div>
         				</div>
         				<div class="detail-c-box" onclick="clickType(this, 'LL', '浏览总数')">
         					<div class="detail-c">
         						<div class="detail-c-label">浏览总数</div>
         						<div class="detail-c-count"><strong>#{showCount}#</strong></div>
         						<div class="detail-c-day">
									<label class="detail-c-l">昨日</label>
									<label class="detail-c-c">#{showCountDay}#</label>
								</div>
         					</div>
         				</div>
         				<div class="detail-c-box" onclick="clickType(this, 'DK', '打开总数')">
         					<div class="detail-c">
         						<div class="detail-c-label">打开总数</div>
         						<div class="detail-c-count"><strong>#{openCount}#</strong></div>
         						<div class="detail-c-day">
									<label class="detail-c-l">昨日</label>
									<label class="detail-c-c">#{openCountDay}#</label>
								</div>
         					</div>
         				</div>
         				<div class="detail-c-box" onclick="clickType(this, 'HD', '互动总数')">
         					<div class="detail-c">
         						<div class="detail-c-label">互动总数</div>
         						<div class="detail-c-count"><strong>#{hdCount}#</strong></div>
         						<div class="detail-c-day">
									<label class="detail-c-l">昨日</label>
									<label class="detail-c-c">#{hdCountDay}#</label>
								</div>
         					</div>
         				</div>
						</script>

         			</div>
         			<div class="detail-row">
	       				<div class="detail-s">
	       					<span class="detail-s-bar" onclick="beforeDate(-7, this,7)"><span class="detail-s-btn">7天</span></span>
	       					<span class="detail-s-bar active" onclick="beforeDate(-14, this,14)"><span class="detail-s-btn">14天</span></span>
	       					<span class="detail-s-bar" onclick="beforeDate(-30, this,30)"><span class="detail-s-btn">30天</span></span>
							<span class="detail-s-bar" onclick="beforeDate(null, this,100)"><span class="detail-s-btn">全部</span></span>
							<div data="modal-static">
							<div class="ta_date" style="">
		                        <span class="date_title" id="listStageDate">请选择日期</span>
		                        <a class="opt_sel" ><i class="i_orderd"></i></a>
		                    </div>
		                    <div id="datePicker"></div>
							</div>
	       				</div>
       				</div>
       				<div style="height: 300px;" id="echarts"></div>
       				<div class="detail-table">
       				<h4 class="detail-table-title">
						详细数据
						<span class="detail-table-more">
							<a href="javascript:export_execl();"><i class="icon_export"></i>导出CSV</a>
						</span>
					</h4>
				    <div class="table_list">
		               <div class="table-overflow">
		                   <table class="table">
		                       <thead>
		                           <tr>
		                               <th>
		                               	日期
	                                   </th>
		                               <script type="text/template" id="infoTableHead">
											#for(data:list)#
												<th>#{data.name}#</th>
											#endfor#
										</script>
		                           </tr>
		                       </thead>
		                       <tbody>
		                       <script type="text/template" id="infoDetailCounts">
								#for(data:counts)#
									<tr>
										<td>#{data.date}#</td>
										#{data.countHtml}#
									</tr>
								#endfor#
								</script>
		                     </tbody>
		                 </table>
		             </div>
		          </div>
		          </div>
         		</div>
			</div>
    </div>
    
  </body>
</html>